Ext.define('FirstMate.view.Settings', {
	extend: 'Ext.form.FormPanel',
	alias: 'widget.settingsview',
	id : 'settingsView',
	config: {
		items: [
		        
		        {
		            xtype: 'fieldset',
		            defaults : {
		        		labelWidth : '50%'
		        	},
		            title: 'Currents',
		            items: [
							{
							    xtype: 'selectfield',
							    label: 'Resolution',
							    value : '6km',
							    id: 'radarResolutionField',
			                    identifier: {
			                        type: 'uuid'
			                    },
							    disabled : false,
							    options: [
							        {text: '6km',  value: '6km'},
							        {text: '2km',  value: '2km'},
							        {text: '1km',  value: '1km'},
							        {text: '500m',  value: '500m'}
							    ]
							},
			                {

								xtype: 'datepickerfield',
								dateFormat : 'M j Y H i A',
							    label: 'TimeStamp At Location',
							    id: 'radarTimestampField',
							    disabled : true
			                }

		            ]
		        },
		        {
		            xtype: 'fieldset',
		            title: 'Display Units',
		            defaults : {
		        		labelWidth : '50%'
		        	},
		            items: [
		                    {
			                    xtype: 'selectfield',
			                    //label: 'Units',
			                    id: 'tideUnitsField',
			                    identifier: {
			                        type: 'uuid'
			                    },
			                    value : 'ft',
			                    options: [
			                        {text: 'US', value: 'ft'},
			                        {text: 'Metric',  value: 'm'}
			                    ]
			                }

		            ]
		        },
		        	        
		        {
		            xtype: 'fieldset',
		            title: 'Tides',
		            defaults : {
		        		labelWidth : '50%'
		        	},
		            items: [
			                {
			                    xtype: 'togglefield',
			                    label: 'Now',
			                    id: 'useCurrentTimeField',
			                    identifier: {
			                        type: 'uuid'
			                    },
			                    value: true
			                },
		    		        {
		    		        	xtype: 'datepickerfield',
		    		        	disabled : true,
		    		        	label: 'As of',
		    		        	id: 'asOfDateField',
			                    identifier: {
			                        type: 'uuid'
			                    },
		    		        	dateFormat : 'M j Y H i A',
		    		        	picker :{
		    		        		yearFrom : new Date().getFullYear(),
		    		        		yearTo : new Date().getFullYear() + 5
		    		        	},
		    		        	value: new Date()	             
		    		        },		    		        
		    		        {
		    					xtype : 'sliderfield', 
		    				    label: 'Search Radius',
		    				    id : 'radiusField',
			                    identifier: {
			                        type: 'uuid'
			                    },
		    				    minValue: 20,
		    				    value : 30, 
		    				    maxValue: 2500
		    				},
							{
							    xtype: 'selectfield',
							    label: 'Radius Units',
							    value : 'nm',//FirstMate.app.searchUnits,
							    id: 'searchUnitsField',
			                    identifier: {
			                        type: 'uuid'
			                    },
							    options: [
							        {text: 'US nm',  value: 'nm'},
							        {text: 'km',     value: 'km'}
							    ]
							}

		            ]
		        },

		        {
		            xtype: 'fieldset',
		            title: 'Layers',
		        	defaults : {
		        		labelWidth : '50%'
		        	},
		            items: [
			                {
			                    xtype: 'togglefield',
			                    label: 'Places',
			                    id: 'KmlField'//,
			                    //value: FirstMate.app.KmlLayerOn
			                },
			                {
			                    xtype: 'togglefield',
			                    label: 'Weather',
			                    id: 'weatherField',
				                    identifier: {
				                        type: 'uuid'
				                    }//,
			                    //value: FirstMate.app.weatherLayerOn
			                },
			                {
			                    xtype: 'togglefield',
			                    label: 'Clouds',
			                    id: 'cloudField',
				                    identifier: {
				                        type: 'uuid'
				                    }//,
			                    //value: FirstMate.app.cloudLayerOn
			                },
			                {
			                    xtype: 'togglefield',
			                    label: 'Bicycle Routes',
			                    id: 'bicycleField',
				                    identifier: {
				                        type: 'uuid'
				                    }//,
			                    //value: FirstMate.app.bicycleLayerOn
			                }
		            ]
		        },
		        {
		            xtype: 'fieldset',
		            title: 'Places',
		            defaults : {
		        		labelWidth : '50%'
		        	},
		            instructions: 
		            			//+'<br><br>'
		            			'You may also edit the Places map, if you have a fav spot to share<br><br>'
		            			+ 'It is located at the above url, and is limited to notes on Sailing\/Cruising\/Anchoring - NY-NJ-CT-RI-MA<br>'
		            			+ 'Please note that this map is public<br><br.' 
		            			+ 'You may want to substitute your own map with the notes, places, etc.<br><br><br>' 
		            			+ 'And of course, if you would like a private fishing spot shared between your buddies only,<br>' 
		            			+ 'you may create your own map, using Google Maps\/My Places\/Maps, and paste it\'s KML link in the space above :)'
		            ,
		            items: [
						{
						    config : {autoComplete:true},
							xtype: 'textfield',
						    label: 'KML url',
						    id: 'KmlUrlField',
		                    identifier: {
		                        type: 'uuid'
		                    },
						       //data:siteStore,
						        autoComplete:true,
						    //value: 'https://maps.google.com/maps/ms?authuser=0&vps=2&hl=en&ie=UTF8&msa=0&output=kml&msid=210170922038761591804.000438ee5192effaa787e' //FirstMate.app.KmlLayerUrl,		    
						    value : 'http://goo.gl/Zp0ODY'
						}
		            ]
		        }
		        ]
	}
});